<section class="conversation-container">
    <header id="conversationHeader">
        <h1>
            <span ng-if="conversation.NumMessages > 1">({{ conversation.NumMessages }})</span>
            <span>{{ conversation.Subject | unescape }}</span>
            <pt-star data-model="conversation" data-pt-star-type="conversation" class="pm_buttons"></pt-star>
        </h1>
        <div ng-hide="'secured.search.**' | includedByState" class="containsMessage">
            <p ng-if="showNotifier('trash')" class="alert">
                <span ng-show="inTrash === false" translate translate-context="Info">This conversation contains trashed messages.</span>
                <span ng-show="inTrash === true" translate translate-context="Info">This conversation contains non-trashed messages.</span>
                <a href="#" ng-click="toggleOption('showTrashed')" ng-show="showTrashed === false && inTrash === false" translate translate-context="Action">Show trashed messages</a>
                <a href="#" ng-click="toggleOption('showNonTrashed')" ng-show="showNonTrashed === false && inTrash === true" translate translate-context="Action">Show non-trashed messages</a>
                <a href="#" ng-click="toggleOption('showTrashed')" ng-show="showTrashed === true && inTrash === false" translate translate-context="Action">Hide trashed messages</a>
                <a href="#" ng-click="toggleOption('showNonTrashed')" ng-show="showNonTrashed === true && inTrash === true" translate translate-context="Action">Hide non-trashed messages</a>
            </p>
        </div>
    </header>
    <div id="pm_thread" tabindex="0">
        <message
            id="message{{ $index }}"
            data-model="message"
            data-marked="markedMessage"
            data-last="$last"
            data-index="$index"
            ng-repeat="message in messages | filter: filterMessages:showTrashed:showNonTrashed track by message.ID"
        ></message>
    </div>

</section>
